import { createRouter, createWebHistory } from "vue-router";

// 导入Home组件
import Home from '../components/home/Home.vue';
	import Homepage from '../components/home/page/Homepage.vue';
	// 导入详情页Detail组件
	import Detail from '../components/home/page/Detail.vue';
	// 导入购物车Cart组件
	import Cart from '../components/home/page/Cart.vue';
	// 引入Order组件
	// import Remix from '../components/home/page/Remix.vue';
	import Order from '../components/home/page/Order.vue';
// 导入Adm组件
import Adm from '../components/adm/Adm.vue';
	// 导入类型管理组件
	import Type from '../components/adm/page/Type.vue';
	// 导入书本管理组件
	import Book from '../components/adm/page/Book.vue';
	// 引入书本管理修改组件
	import Bookedit from '../components/adm/page/Bookedit.vue';
	// 导入热点管理组件
	import Hot from '../components/adm/page/Hot.vue';
	// 引入热点管理修改组件
	import Hotedit from '../components/adm/page/Hotedit.vue';
	// 引入Make组件
	import Make from '../components/home/page/Make.vue';
	// 引入Pay组件
	import Pay from '../components/home/page/Pay.vue';
	// 引入Message组件
	import Message from '../components/home/page/Message.vue';

// 引入Login组件
	// import Login from '../components/remix/Login.vue';
// 引入Admin组件
	// import Admin from '../components/remix/Admin.vue';
// 引入Info组件
	// import Info from '../components/remix/Info.vue';


const routes = [
	{
		path : '/',
		redirect : '/home'
	},
	{
		path : '/home',
		name : 'Home',
		redirect : {
			name : 'Homepage'
		},
		component : Home,
		children : [
			{
				path : '',
				name : 'Homepage',
				component : Homepage
			},
			{
				path : 'detail',
				name : 'Detail',
				component : Detail
			},
			{
				path : 'cart',
				name : 'Cart',
				component : Cart,
				meta : {
					role : 'P'
				},
			},
			{
				path : 'order',
				name : 'Order',
				component : Order,
				meta : {
					role : 'P'
				}
			},
			{
				path : 'make',
				name : 'Make',
				component : Make
			},
			{
				path : 'pay',
				name : 'Pay',
				component : Pay
			},
			{
				path : 'message',
				name : 'Message',
				component : Message,
				meta : {
					role : 'P'
				},
			}
		]
	},
	{
		path : '/adm',
		name : 'Adm',
		component : Adm,
		meta : {
			role : 'G'
		},
		children : [
			{
				path : 'type',
				name : 'Type',
				component : Type
			},
			{
				path : 'book',
				name : 'Book',
				component : Book
			},
			{
				path : 'bookedit',
				name : 'Bookedit',
				component : Bookedit
			},
			{
				path : 'hot',
				name : 'Hot',
				component : Hot
			},
			{
				path : 'hotedit',
				name : 'Hotedit',
				component : Hotedit
			}
		]
	},
	// {
	// 	path : '/',
	// 	redirect : '/login'
	// },
	// 所有用户都能进入
	// {
	// 	path : '/login',
	// 	name : 'Login',
	// 	component : Login
	// },
	// 登录前台账号才能进入
	// {
	// 	path : '/info',
	// 	name : 'Info',
	// 	component : Info,
	// 	meta : {
	// 		role : 'P'
	// 	}
	// },
	// 登录后台账号才能进入
	// {
	// 	path : '/admin',
	// 	name : 'Admin',
	// 	component : Admin,
	// 	meta : {
	// 		role : 'G'
	// 	}
	// },
];

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes,
});

// 路由守卫:在跳转一个页面之前,判断当前用户是否合法/是否具有访问权限
router.beforeEach( (to , from , next)=>{
	// 1.在任意一个地址跳转的时候,从本地存储中获取当前登录的角色值[未登录,role为空]
	let role = localStorage.getItem( 'role' );
	// 没有限制规则的路径地址也能正常访问
	if( to.meta.role == undefined || to.meta.role == '' ){
		next();
		return;
	}
	
	// 进入后台首页:role是否与规则中的要求匹配
	// 判断即将进入的路由规则中限制的访问角色规则,是否与当前登录者的角色匹配
	if( to.meta.role == role ){
		// 继续进入
		next();
		return;
	}
	
	// 以上都不需要的路由,默认跳转返回登录页
	router.replace('/').catch( (error)=>{
		console.log('地址不存在');
	} )
	
} )

export default router;
